<template>
  <div class="content">
    <div>
      <div class="cover">
        <template v-if="type==1">
          <div class="cover-bottom">
            <el-table
                :data="tableData"
                style="width: 100%;">
              <el-table-column
                  prop="id"
                  label="序号"
                  min-width="50"
              >
              </el-table-column>
              <el-table-column
                  prop="realName"
                  width="110"
                  label="姓名"
                  min-width="90"
              >
              </el-table-column>
              <el-table-column
                  prop="wishWorkTypeId"
                  width="100"
                  label="求职意向"
              >
                <template slot-scope="scope">
                  <span style="color: #fff;">{{scope.row.wishWorkTypeId?scope.row.wishWorkTypeId:'暂无'}}</span>
                </template>
              </el-table-column>
              <el-table-column prop="sexText" label="第一次推送">
                <template slot-scope="scope">
                  <span style="color: #fff;" >{{scope.row.oneHelpTime}}{{scope.row.oneHelp}}</span>
                </template>
              </el-table-column>
              <el-table-column  prop="mobile"  label="第二次推送">
                <template slot-scope="scope">
                  <span style="color: #fff;">{{scope.row.twoHelpTime}}{{scope.row.twoHelp}}</span>
                </template>
              </el-table-column>
              <el-table-column  prop="mobile"  label="第三次推送">
                <template slot-scope="scope">
                  <span style="color: #fff;">{{scope.row.threeHelpTime}}{{scope.row.threeHelp}}</span>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </template>
        <template v-if="type==2&&seriesName=='未就业'||seriesName=='未帮扶'">
          <div class="cover-bottom">
            <el-table
                :data="tableData"
                style="width: 100%;">
              <el-table-column
                  prop="id"
                  min-width="80"
                  label="序号"
              >
              </el-table-column>
              <el-table-column
                  prop="realName"
                  min-width="100"
                  label="姓名"
              >
              </el-table-column>
              <el-table-column
                  prop="sexText"
                  min-width="50"
                  label="性别"
              >
              </el-table-column>
              <el-table-column
                  prop="age"
                  label="年龄"
                  min-width="50"
              >
              </el-table-column>
              <el-table-column
                  prop="educationText"
                  label="学历"
                  min-width="100"
              >
              </el-table-column>
              <el-table-column
                  prop="wishWorkTypeText"
                  label="求职意向"
                  min-width="140"
              >
                <template slot-scope="scope">
                  <span style="color: #fff;">{{scope.row.wishWorkTypeText?scope.row.wishWorkTypeText:'暂无'}}</span>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </template>
        <template v-if="type==2&&seriesName=='已就业'">
          <div class="cover-bottom">
            <el-table
                :data="tableData"
                style="width: 100%;">
              <el-table-column
                  prop="id"
                  min-width="80"
                  label="序号"
              >
              </el-table-column>
              <el-table-column
                  prop="realName"
                  min-width="100"
                  label="姓名"
              >
              </el-table-column>
              <el-table-column
                  prop="wishWorkTypeText"
                  label="求职意向"
                  min-width="200"
              >
                <template slot-scope="scope">
                  <span style="color: #fff;">{{scope.row.wishWorkTypeText?scope.row.wishWorkTypeText:'暂无'}}</span>
                </template>
              </el-table-column>
              <el-table-column
                  prop="sexText"
                  min-width="50"
                  label="性别"
              >
              </el-table-column>
              <el-table-column
                  prop="age"
                  label="年龄"
                  min-width="50"
              >
              </el-table-column>
              <el-table-column
                  prop="educationText"
                  label="学历"
                  min-width="80"
              >
              </el-table-column>
              <el-table-column
                  prop="workGo"
                  label="就业去向"
                  min-width="150"
              >
                <template slot-scope="scope">
                  <span style="color: #fff;">{{scope.row.workGo?scope.row.workGo:'暂无'}}</span>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </template>
        <div class="paging">
          <el-pagination
              background
              :page-size="limit"
              layout="prev, pager, next"
              prev-text="上一页"
              next-text="下一页"
              :total="count"
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page="this.page">
          </el-pagination>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import {
  aksListApi, aksQuestionnaireListApi,
  dhListApi, dhQuestionnaireListApi,
  getListApi,
  getQuestionnaireListApi,
  gzListApi, gzQuestionnaireListApi,
  jtListApi, jtQuestionnaireListApi,
  sbListApi, sbQuestionnaireListApi,
  ymListApi, ymQuestionnaireListApi
} from "@/api/statistics6";

export default {
  name: "Personal",
  props:{
    title:{
      type:String,
      default:''
    },
    detail: {
      type:Object,
    },
    type: {
      type:Number,
    },
    seriesName:{
      type:String,
      default:''
    },
  },
  data(){
    return {
      tableData: [],
      count: 2,
      page: 1,
      limit: 10,
      limit1:7,
      isShow: true,
    }
  },
  mounted() {
    this.getList()
  },
  methods:{
    getList(){
      //平台帮扶三次未就业
    if(this.type==1&&this.title=='肃州区'){
      getListApi({page:this.page,limit:this.limit1,type:1}).then((res)=>{
        this.tableData=res.data.list
        this.count=res.data.count
      })
    }
    if(this.type==1&&this.title=='金塔县'){
      jtListApi({page:this.page,limit:this.limit1,type:1}).then((res)=>{
        this.tableData=res.data.list
        this.count=res.data.count
      })
    }
      if(this.type==1&&this.title=='敦煌市'){
        dhListApi({page:this.page,limit:this.limit1,type:1}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==1&&this.title=='瓜州县'){
        gzListApi({page:this.page,limit:this.limit1,type:1}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==1&&this.title=='玉门市'){
        ymListApi({page:this.page,limit:this.limit1,type:1}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==1&&this.title=='肃北县'){
        sbListApi({page:this.page,limit:this.limit1,type:1}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==1&&this.title=='阿克塞县'){
        aksListApi({page:this.page,limit:this.limit1,type:1}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }

      //督办帮扶未就业人员情况（未就业）
      if(this.type==2&&this.title=='肃州区'&&this.seriesName=='未就业'){
        getQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isWork:0}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==2&&this.title=='金塔'&&this.seriesName=='未就业'){
        jtQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isWork:0}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==2&&this.title=='敦煌'&&this.seriesName=='未就业'){
        dhQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isWork:0}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==2&&this.title=='瓜州'&&this.seriesName=='未就业'){
        gzQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isWork:0}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==2&&this.title=='玉门'&&this.seriesName=='未就业'){
        ymQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isWork:0}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==2&&this.title=='肃北'&&this.seriesName=='未就业'){
        sbQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isWork:0}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==2&&this.title=='阿克塞'&&this.seriesName=='未就业'){
        aksQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isWork:0}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }

      //督办帮扶未就业人员情况（已就业）
      if(this.type==2&&this.title=='肃州区'&&this.seriesName=='已就业'){
        getQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isWork:1}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==2&&this.title=='金塔'&&this.seriesName=='已就业'){
        jtQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isWork:1}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==2&&this.title=='敦煌'&&this.seriesName=='已就业'){
        dhQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isWork:1}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==2&&this.title=='瓜州'&&this.seriesName=='已就业'){
        gzQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isWork:1}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==2&&this.title=='玉门'&&this.seriesName=='已就业'){
        ymQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isWork:1}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==2&&this.title=='肃北'&&this.seriesName=='已就业'){
        sbQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isWork:1}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==2&&this.title=='阿克塞'&&this.seriesName=='已就业'){
        aksQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isWork:1}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }

      //未帮扶
      if(this.type==2&&this.title=='肃州区'&&this.seriesName=='未帮扶'){
        getQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isHelp:2}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==2&&this.title=='金塔'&&this.seriesName=='未帮扶'){
        jtQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isHelp:2}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==2&&this.title=='敦煌'&&this.seriesName=='未帮扶'){
        dhQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isHelp:2}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==2&&this.title=='瓜州'&&this.seriesName=='未帮扶'){
        gzQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isHelp:2}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==2&&this.title=='玉门'&&this.seriesName=='未帮扶'){
        ymQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isHelp:2}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==2&&this.title=='肃北'&&this.seriesName=='未帮扶'){
        sbQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isHelp:2}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
      if(this.type==2&&this.title=='阿克塞'&&this.seriesName=='未帮扶'){
        aksQuestionnaireListApi({page:this.page,limit:this.limit,isImport:1,isHelp:2}).then((res)=>{
          this.tableData=res.data.list
          this.count=res.data.count
        })
      }
    },
    handleSizeChange(e) {
      this.limit = e
      this.getList()
    },
    handleCurrentChange(e) {
      this.page = e
      sessionStorage.setItem('currentPage',this.page)
      this.getList()
    },
  },
  computed:{
    thousands(){
      return typeof this.number==='number'?this.number.toLocaleString():this.number;
    }
  }
}
</script>

<style scoped lang="scss">
.content{
  .cover{
    position: relative;
    width: 1000px;
    height: 100%;
    //background-color: #0A1456;
    border-radius: 15px;
    padding: 20px;
    .cover-middle{
      display: flex;
      margin: 20px 0;
      .street{
        color: #ffffff;
        margin-right: 20px;
        ::v-deep{
          .el-input__icon{
            height: 116%;
          }
          .el-input__inner{
            display: flex;
            align-items: center;
            background-color: #0A1456;
            border: 1px solid #216CBB;
            height: 30px;
            width: 180px;
          }
          .el-select-dropdown__list{
            background-color: #0A1456;

          }
        }
      }
      .village{
        color: #ffffff;
        ::v-deep{
          .el-input__icon{
            height: 116%;
          }
          .el-input__inner{
            display: flex;
            align-items: center;
            background-color: #0A1456;
            border: 1px solid #216CBB;
            height: 30px;
            width: 180px;
          }
          .el-select-dropdown__list{
            background-color: #0A1456;

          }
        }
      }
    }
    .cover-bottom{
      width: 100%;
      height: calc(100% - 127px);
      overflow: hidden;
      ::v-deep{
        .el-table th.el-table__cell{
          background-color: rgba(72, 75, 147, 0.5);
          text-align: center;
          color: #fff;
        }
        .el-table tr{
          background-color: #0A1456;
        }
        .el-table .el-table__cell{
          background-color: #0A1456;
          border-bottom: 1px solid #394276;
          text-align: center;
        }
        .el-table .cell{
          color: #fff;
        }
      }
    }
    .paging{
      display: flex;
      justify-content: center;
      margin-top: 10px;
      ::v-deep{
        .el-pagination.is-background .btn-prev{
          background-color: rgba(72, 75, 147, 0.5);
          padding: 0 10px;
        }
        .el-pagination.is-background .btn-prev span{
          color: #fff;
        }
        .el-pagination.is-background .btn-next{
          background-color: rgba(72, 75, 147, 0.5);
          padding: 0 10px;
        }
        .el-pagination.is-background .btn-next span{
          color: #fff;
        }
      }
    }
  }
}
</style>
